<template>
  <div class="dashboard-container">
    <fm-making-form
      ref="makingform"
      style="height: 500px;"
      preview
      generate-code
      generate-json
      clearable
      upload
    >
      <template slot="action">
        <el-button type="text" icon="el-icon-check" @click="saveClick">保存</el-button>
      </template>
    </fm-making-form>

    <save-fomr-config
      :is-show.sync="isShowSaveModal"
      :form-config="currentFormConfig"
      @clearEditor="clearEditor"
    />
  </div>
</template>

<script>
import SaveFomrConfig from './SaveFormConfig';
import ConfigJson from './FormList/config';
export default {
  name: 'Dashboard',
  components: { SaveFomrConfig },

  data() {
    return {
      isShowSaveModal: false,
      currentFormConfig: {}
    };
  },
  mounted(){
    // this.$refs.makingform.setJSON(ConfigJson);
  },
  methods: {
    saveClick() {
      this.currentFormConfig = this.$refs.makingform.getJSON();
      this.isShowSaveModal = true;
    },
    clearEditor() {
      this.$refs.makingform.clear();
    }
  }
};
</script>

<style lang="scss" scoped>
.dashboard {
  &-container {
    height: 100%;
  }

}
</style>
